//定义懒加载插件

import {useIntersectionObserver} from '@vueuse/core'

export const lazyPlugin= {
    install(app){
        app.directive('img-lazy', {
            mounted(el, binding) {
                //el 绑定的元素
                //bingding ,指令对象， 等于后面表达的值
                const {stop} =useIntersectionObserver(
                    el,
                    ([{isIntersecting}]) => {
                        if(isIntersecting) {
                            el.src = binding.value
                            stop()
                        }
                    }
                )  
            }
        })
    }
}